<template>
	<w-container class="rank-user" :loading="loading">
		<w-navbar leftIcon="back-btn" :titleStyle="{color:'#222'}" :title="title" :placeholder="false"></w-navbar>
		<view class="top">
			<w-image src='/static/bg/dragonTigerList.png' width="375" mode="widthFix"></w-image>
			<!-- <HeaderList :items='dataList.headUser' /> -->
		</view>
		<scroll-view scroll-y="true"  class="list">
			<view class="list-container">
				<view class="ptb-8 item flex" v-for="item in list" :key="item.id">
					<w-image :src='item.goods_cover_image' radius="12" width="90" height="90"></w-image>
					<view class="font-size-12 flex flex-dir-col flex-js-sb pl-12 flex-1">
						<view class="font-color-textPrimary">
							{{item.goods_name}}
						</view>
						<view class="font-color-dark">
							购入均价：￥{{item.total_price}}
						</view>
						<view class="font-color-convention">
							购入数量：
							<text class="font-color-textPrimary">{{item.num}}</text>
						</view>
						<view class="font-color-dark">
							{{item.createtime|formatDate}}
						</view>
					</view>
					<view class="font-size-12">
						<w-button size="ss" class="mb-8" type="primary" shape="circle" @click='toBuy(item)'>去购买</w-button>
						<text class="font-color-textPrimary ">{{item.count}}人已去购买</text>
					</view>
				</view>
			</view>
		</scroll-view>
	</w-container>
</template>

<script>
	import{getUserRank,setClickNum} from '@/api/common/index.js'
	export default {
		data() {
			return {
				loading: true,
				title:"买入清单",
				list:[],
				id:null
			}
		},
		onLoad({id}) {
			this.id=id;
			// this.getRank(id)
		},
		onShow() {
			this.getRank(this.id)
		},
		onPullDownRefresh() {
			this.getRank(this.id)
		},
		methods: {
			toBuy({batch_order,c_goods_id}){
				setClickNum(batch_order).then(res=>{
					uni.navigateTo({
						url:'/pages/market/marketGoodsList?id='+c_goods_id
					})
				})
			},
			getRank(id){
				getUserRank(id).then(res=>{
					this.list=Object.values(res.data)
					if(this.list[0]){
						 this.title=this.list[0].nickname+"的买入清单"
					}
				}).finally(e=>{
					uni.stopPullDownRefresh()
					this.loading=false
				})
			}
		}
	}
</script>

<style lang="scss">
.rank-user{
	// background-image: url($IMG_URL+'/static/bg/dragonTigerList.png');
	background-size: 750rpx auto;
	background-repeat: no-repeat;
	// background-color: #03031D;
	.list{
		height: calc(100vh - 600rpx);
		@extend .bg-color-white,.br-12,.mt-16;
		&-container{
			@extend .pa-16;
			>.item{
				border-bottom: 1px solid rgba(0,0,0,0.05);
			}
			.item:last-child{
				border: none;
			}
		}
	}
}
</style>
